// pages/player/player.js
let db = wx.cloud.database().collection
Page({

    /**
     * 页面的初始数据
     */
    data: {
        id:"001", //歌曲id，默认001
        ranking_id:"2123", //排行榜 榜单id
        arrayname:'newest', //歌曲列表集合名
        recently:[], //最近播放暂存数组
        likes:[], //我的喜欢暂存数组
        music:[], //当前播放列表
        item:{}, //当前播放歌曲对象
        _index:0, //当前播放歌曲索引
        total:0, //当前播放歌曲列表的歌曲总数量
        palyer:false, //控制播放/暂停图标的切换
        HalfScreenList:false, //控制歌曲播放列表的显示
        time:'', //歌曲当前播放时长，用于控制进度条的进度
        time_max:'04:21', //歌曲总播放时长
        time_min:'00:00', //歌曲当前播放时长
        time_img:'', //控制当前歌曲封面图片的旋转
        
    },
//单击列表图标时触发
listbandler(){
    let list = this.data.music
    this.setData({HalfScreenList:true})
},
//单击 列表关闭
closeListbandler(){
    this.setData({HalfScreenList:false})
},
//单击播放列表歌曲时，播放所点击的歌曲
playlistbandler(e){
    console.log(e.currentTarget.dataset.id);
    let id = e.currentTarget.dataset.id;
    this.asd(id)
    this.setData({HalfScreenList:false})
},
//单击爱心图标触发
likebandler(){
    let v = this.data._index
    let list = this.data.music
    let likes = this.data.likes
    let item = this.data.item
    if (item.like == false) {
        list[v].like = true
        likes.unshift(item)
        wx.setStorage({
            key:'likes',
            data:likes
        })
        this.setData({music:list,item})
    }else{
        list[v].like = false
        let like_v = likes.findIndex(value=>value.id == item.id)
        likes.splice(like_v,1)
        wx.setStorage({
            key:'likes',
            data:likes
        })
        this.setData({music:list,item})
    }

    
},
//将播放歌曲存入数据缓存（最近播放）
insertstorage(id,item){ 
    let recently = this.data.recently
    //通过id获取索引，若索引为-1则该歌曲未在最近播放中
    let index = recently.findIndex(value=>value.id == id)
    if (index==-1 && item!=null) { //判断缓存中是否已有相同歌曲，且歌曲不能为空
        recently.unshift(item)
        console.log(recently);
        wx.setStorage({
            key:"recently",
            data: recently,
        })
    }
    
},
//获取到歌曲列表后，要调用的方法
asd(id){
    let that = this
    let music = that.data.music
    let array = that.data.likes
    console.log(music);
    console.log(array);
    //通过for将当前歌曲列表中已添加到我的喜欢的歌曲的爱心图标样式更改
    for (let index = 0; index < array.length; index++) {
        const element = array[index];
        let v = music.findIndex(value=>value.id == element.id)
        if (v!=-1) {
            music[v].like = true
            that.setData({music})
        }
    }
    //通过id拿到当前歌曲索引、歌曲对象
    let _index = music.findIndex(value=>value.id == id)
    let item = music.find(value=>value.id == id)
    console.log(item);
    console.log(_index);
    that.setData({item,_index})
    //调用数据缓存方法
    that.insertstorage(id,item)
},


    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        //拿到上一个页面传来的id、_id,并传入data中
        console.log(options);
        let that = this
        let eventChannel = this.getOpenerEventChannel()
        // 监听 acceptDataFromOpenerPage 事件，获取上一页面通过 eventChannel 传送到当前页面的数据
        eventChannel.once('acceptDataFromOpenerPage',function(data) {
            console.log(data)
            console.log(data.id) //获取歌曲id
            console.log(data.ranking_id) //获取排行榜 榜单id
            console.log(data.arrayname) //获取当前歌曲列表集合名
            let arrayname = data.arrayname
            let id = data.id
            let ranking_id = data.ranking_id
            console.log(id);
            console.log(arrayname);
            that.setData({id,arrayname,ranking_id}) //存入对应数据中，方便后续调用
        })

        let id = that.data.id
        let arrayname = that.data.arrayname
        let ranking_id = that.data.ranking_id
        console.log(id);
        console.log(arrayname);
        //获取之前已存入的数据缓存（最近播放），防止再次存入刷新缓存数据
        wx.getStorage({
            key: 'recently',
            success (res) {
                console.log(res.data)
                that.setData({
                    recently:res.data
                })
            }
        })
        //获取之前已存入的数据缓存（喜欢的音乐）
        wx.getStorage({
            key: 'likes',
            success (res) {
                console.log(res.data)
                that.setData({
                    likes:res.data
                })
            }
        })
        if (arrayname == 'ranking') { //当集合名为ranking（排行榜）
            db(arrayname).get({
                success(res){
                    console.log(res.data[0].arrayitem);
                    let list = res.data[0].arrayitem.find(value=>value.id == ranking_id)
                    console.log(list.globals);
                    that.setData({
                        music:list.globals,
                        total:list.globals.length
                    })
                    that.asd(id)
                }
            })
        }else if (arrayname == 'likes') { //当集合名为likes（喜欢的音乐）
            wx.getStorage({
                key:'likes',
                success(res){
                    console.log(res.data);
                    that.setData({
                        music:res.data,
                        total:res.data.length
                    })
                    let music = that.data.music
                    let _index = music.findIndex(value=>value.id == id)
                    let item = music.find(value=>value.id == id)
                    console.log(item);
                    console.log(_index);
                    that.setData({item,_index})
                    that.insertstorage(id,item)
                }
            })
        }else if (arrayname == 'recently') { //当集合名为recently（最近播放）
            console.log("aaa");
            wx.getStorage({
                key:'recently',
                success(res){
                    console.log(res.data);
                    that.setData({
                        music:res.data,
                        total:res.data.length
                    })
                    that.asd(id)
                }
            })
        }else if (arrayname == 'search') { //当集合名为search（搜索到的歌曲列表）
            wx.getStorage({
                key:'searchList',
                success(res){
                    console.log(res.data);
                    that.setData({
                        music:res.data,
                        total:res.data.length
                    })
                    that.asd(id)
                }
            })
        }else{
            db(arrayname).get({
                success(res){
                    console.log(res.data[0].arrayitem);
                    that.setData({
                        music:res.data[0].arrayitem,
                        total:res.data[0].arrayitem.length
                    })
                    that.asd(id)
                    
                }
            })
        }
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {
        //通过API绑定audio组件
        this.audioCtx = wx.createAudioContext('myaudio')
        this.audioCtx.play() //执行播放
        this.setData({
            palyer:true //显示播放图标
        })
        
    },
    //  播放/暂停方法
    audioPlay: function () {
        //判断当前播放状态
        if (this.data.palyer) {
            this.audioCtx.pause() //执行暂停
            this.setData({
                palyer:false //显示暂停图标
            })
        }else{
            this.audioCtx.play() //执行播放
            this.setData({
                palyer:true
            })
        }
      },
    // 进度条到末尾是执行该方法
    endbandler(){
        let _index = this.data._index //获取歌曲索引
        _index = _index+1 //索引+1
        let total = this.data.total //获取当前歌曲集合长度
        if (_index < total) { //判断该歌曲是否为当前歌曲集合中的最后一首歌曲
            this.setData({
                item:this.data.music[_index], //将下一首歌曲存入item对象中
                _index:_index //更新data中的索引值
            })
            this.insertstorage(this.data.music[_index].id,this.data.music[_index+1]) 
            //存入最近播放中
            if (this.data.palyer) { //判断播放状态并执行对应操作
                this.audioCtx.play()
            }else{
                this.audioCtx.pause()
            }
            this.audioCtx.seek(0)
        }else{
            //已是最后一首并执行暂停
            console.log("已经是最后一首歌曲了");
            this.audioCtx.pause()
            this.setData({
                palyer:false
            })
        }

    },
    next(){ //点击下一首执行的方法
        //获取索引，集合长度
        let _index = this.data._index
        _index = _index+1
        let total = this.data.total
        //判断该歌曲是否为当前歌曲集合中的最后一首歌曲
        if (_index < total) {
            this.setData({
                item:this.data.music[_index],
                _index:_index
            })
            //存入最近播放中
            this.insertstorage(this.data.music[_index].id,this.data.music[_index])
            if (this.data.palyer) {
                this.audioCtx.play()
            }else{
                this.audioCtx.pause()
            }
            this.audioCtx.seek(0)
        }else{
            console.log("已经是最后一首歌曲了");
        }
        

        
    },
    upper(){ //点击上一首执行
        let _index = this.data._index
        if (_index > 0) {
            this.setData({
                item:this.data.music[_index-1],
                _index:_index-1
            })
            this.insertstorage(this.data.music[_index-1].id,this.data.music[_index-1])
            if (this.data.palyer) {
                this.audioCtx.play()
            }else{
                this.audioCtx.pause()
            }
            this.audioCtx.seek(0)
        }else{
            console.log("这是第一首歌曲了");
        }

    },
    //实时获取播放进度
    timebandler(res){
        // console.log(res.detail.duration);
        // console.log(res.detail.currentTime);
        //通过Math.floor将数据转化为整数
        //播放总时长
        let a = Math.floor(res.detail.duration/60)
        let _a = Math.floor(res.detail.duration%60)
        // s用于之后控制封面图片转动
        let s = res.detail.currentTime*2
        //当前播放时长
        let b = Math.floor(res.detail.currentTime/60)
        let _b = Math.floor(res.detail.currentTime%60)
        // console.log(s);
        // console.log(_a);
        // console.log(b);
        // console.log(_b);
        // 10秒之前，规范当前播放时长的格式
        if (_b<10) {
            _b = "0"+_b
        }
        // console.log(s);
        // 通过setData方法实现 实时数据变化
        this.setData({
            time:((res.detail.currentTime)/(res.detail.duration))*100+"%",
            time_max:"0"+a+":"+_a,
            time_min:"0"+b+":"+_b,
            time_img:s+"deg",
        })
        // console.log(this.data.time)
        // console.log(this.data.time_max)
        // console.log(this.data.time_min)

    },


    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {

    }
})